<template>
	<view>
		<form @submit="formSubmit"  >
			<radio-group class="un-r" name="money">
				<label class="uni-list-cell uni-list-cell-pd un-l" v-for="(item, index) in items" :key="item.ID" @click="radioChange(item)" :class="item.checked?' un-c':'un-cc'">
					<view>
						<radio :value="item.SELLPRICE+''"  v-show="false"  :checked="item.checked"/>
					</view>
					<view>{{item.SELLPRICE}}元</view>
				</label>
			</radio-group>
			
			<view class="un-t">提示： 选择金额点击充值！</view>
			
			<view class="uni-btn-v uni-common-mt un-ti" >
				<button style="background-color: #E02E24;" class="btn-submit" formType="submit" type="primary">充值</button>
			</view>
		</form>
	</view>
</template>

<script>
	//来自 graceUI 的表单验证， 使用说明见手册 http://grace.hcoder.net/doc/info/73-3.html
	var  graceChecker = require("../../common/graceChecker.js");
	export default {
		data() {
			return {
				items:[],
				id:'',
				ZSACTIVITY:0,
				ZSCOUPONNUM:0.00,
				ZSDEDUNUM:0.00,
				ZSPOINTNUM:0.00
				
			}
		},
		onLoad(){
			if(!uni.getStorageSync("userInfo")){
				history.back()
			}
			this.loadData()
		},
		methods: {
			async loadData(){
				this.$http.post("/common/rechargeList",{
					SIGNATURE : uni.getStorageSync("SIGNATURE"),
				}).then((res) => {
					if(res.data.STATE === "0" && res.statusCode === 200){
						this.items=res.data.OBJECT.map(i=>{
							 i.checked=false;
							 return i;
							}
						);
					}else{
					}
				}).catch((err)=>{
					console.log('request fail', err);
				})
			},
			radioChange(item){
				this.items.map(it=>{
					it.checked=false;
				})
				item.checked=true;
				this.id=item.ID;
			},
			formSubmit: function (e) {
				//将下列代码加入到对应的检查位置
				//定义表单规则
				var rule = [
					{name:"money", checkType : "notnull", checkRule:"",  errorMsg:"请选择充值金额"}
				];
				//进行表单检查
				var formData = e.detail.value;
				var checkRes = graceChecker.check(formData, rule);
				if(checkRes){
					this.$http.post("/goods/detail1",{
						SIGNATURE : uni.getStorageSync("SIGNATURE"),
						TOKEN: uni.getStorageSync('userInfo').TOKEN,
						GOODSID : this.id,
					}).then((res) => {
						if(res.data.STATE == '903'||res.data.STATE == '904'||res.data.STATE == '905'||res.data.STATE == '906'||res.data.STATE == '907'){
							uni.navigateTo({
								url:'/pages/public/login1'
							})
						}else if (res.statusCode === 200 && res.data.STATE === '0') {  
							if (res.data.OBJECT.ZSCOUPONNUM) {
								this.ZSCOUPONNUM=res.data.OBJECT.ZSCOUPONNUM;
							}
							if (res.data.OBJECT.ZSDEDUNUM) {
								this.ZSDEDUNUM=res.data.OBJECT.ZSDEDUNUM;
							}
							if (res.data.OBJECT.ZSPOINTNUM) {
								this.ZSPOINTNUM=res.data.OBJECT.ZSPOINTNUM;
							}
							this.ZSACTIVITY=res.data.OBJECT.ZSACTIVITY;
							if(this.ZSACTIVITY!=0){
								this.$http.post("/order/save1",{
									SIGNATURE : uni.getStorageSync("SIGNATURE"),
									TOKEN: uni.getStorageSync('userInfo').TOKEN,
									GOODSID : this.id,
									AMOUNT: formData.money,
									COUNT: 1,	
									ZSACTIVITY:this.ZSACTIVITY,//是否赠送
									ZSCOUPONNUM:this.ZSCOUPONNUM,//赠送惠券
									ZSDEDUNUM:this.ZSDEDUNUM,//赠送抵扣券
									ZSPOINTNUM:this.ZSPOINTNUM,//赠送积分
								}).then((res) => {
									if(res.data.STATE == '903'||res.data.STATE == '904'||res.data.STATE == '905'||res.data.STATE == '906'||res.data.STATE == '907'){
										uni.navigateTo({
											url:'/pages/public/login1'
										})
									}else if (res.statusCode === 200 && res.data.STATE === '0') {  
										//跳转支付
										uni.redirectTo({
											url: '/pages/money/pay?ORDERNUM=' + res.data.OBJECT.ORDERNUM + "&AMOUNT=" + formData.money
										})
									}else{
										uni.showToast({title:e.data.MSG, icon:"none"});
									}
								}).catch((err)=>{
									console.log('request fail', err);
								})
							}else{
								uni.showToast({title:'充值订单异常，请重试', icon:"none"});
							}
						}else{
							uni.showToast({title:e.data.MSG, icon:"none"});
						}
					}).catch((err)=>{
						console.log('request fail', err);
					})
					
				}else{
					uni.showToast({ title: graceChecker.error, icon: "none" });
				}
			},
		}
	}
</script>

<style lang="scss">
	page {
			background: #f5f5f5;
			margin-bottom: 100upx;
	}
	.un-ti{
		width: 100%;
		background-color: #F5F5F5; 
		padding: 100upx;
		position: fixed;
		bottom: 0upx;
	}
	.un-t{
		width: 100%;
		background-color: #F5F5F5; 
		padding: 70upx;
		position: fixed;
		bottom: 220upx;
		font-size: 25upx;
		color: #999999;
	}
	.un-r{
		display: flex;
		background-color: #FFFFFF;
		padding: 40upx;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		margin-bottom: 380upx;
		.un-l{
			display: flex;
			margin: 30upx 30upx;
			border-radius: 10upx;
			padding: 15upx 0upx;
			font-size: 28upx;
			width: 150upx;
			justify-content: center;
		}
		.un-c{
			border: #E02E24 4upx solid;
			color: #E02E24;
		}
		.un-cc{
			border: #999999 4upx solid;
			color: #999999;
		}
	}
	
	
</style>
